<template>
  <view class="page">
    <nav-bar>
      <template #title>消息中心</template>
    </nav-bar>
    <van-search
    shape="round"
    show-action
    :clearable="false"
    v-model="searchValue"
    placeholder="请输入搜索关键词"
    autocomplete="off"
  >
    <template #action>
      <view style="color: #1989fa" @click="onSearch">搜索</view>
    </template>
  </van-search>
    <view class="container">
      <AvanList ref="avanList" :searchValue="searchValue" />
    </view>
  </view>
</template>

<script setup lang="ts">
const searchValue = ref("");
const avanList = ref();
function onSearch() {
  console.log(searchValue.value, "onSearch", avanList.value);
  avanList.value?.loadMore();
}
</script>

<style lang="scss" scoped>
.container {
  width: 100%;
  height: calc(100% - 100px);
}
</style>

